$(function () {
    var pid = window.location.href.split("?")[1].split("=")[1];

    $.ajax({
        url: `./api/goodsById/${pid}`,
        type: "get"
    }).then(function (res) {
        var { data } = res;
        $(".minImg").attr("src", data.image[0]);
        $(".mirror").find("img").attr("src", data.image[0]);
        var strImg = ``;
        data.image.forEach((el, index) => {
            console.log(111)
            strImg += `
            <li><a href="javascript:;"><img src="${el}" alt=""></a></li>
            `;
        });
        $(".gmbps_minImg").html(strImg);

        $(".gmbps_minImg li").each((index, el) => {
            $(el).find("img").attr("src", data.image[index]);
        })
        var bianhao = `
        <div class="gmbt_l">
            <span class="c999">编号：</span>
            ${data.pnumber}
        </div>
         <div class="gmbt_r">
              <div class="fl share_icon">
                <a href="">
                    <span>分享</span>
                </a>
            </div>
            <a href="" class="scsp">
                <span>收藏商品</span>
             </a>
        </div>
        `;
        $(".gmb_txt").html(bianhao);
        var title = `${data.pname}`;
        $("title").html(title);

        // 数据块
        var strHtml = `
        <h1 class="gdtitle c333 ft18">${data.pname}</h1>
        <div class="ft14 c93c">${data.psuggest}</div>
        <!-- 价格 -->
        <div class="gd_price ft14 clear">
            <div class="gdp_main">
                <!-- 市场价 -->
                <div class="gdpm_top clear">
                    <div class="gdpmt_main">
                        <span class="c999 fl">市场价&nbsp; : &nbsp;</span>
                        <del class="c333 fl">${data.outprice}</del>
                    </div>
                </div>
                <!-- E宠价 -->
                <div class="gdpm_bot">
                    <span class="c999 fl ">E宠价 : </span>
                    <span class="c93c">￥</span class="c93">
                    <span class="c93c echong">${data.pprice[0]}</span>
                </div>
            </div>
        </div>
        <!-- 数据，评价咨询等 -->
        <div class="gd_data ft14 clear">
            <!-- 数据头部 -->
            <div class="clear gdd_top">
                <!-- 第一块区域 -->
                <div class="gddt_box mt5">
                    <span class="c999">已售：</span>
                    <span class="ce54649">${data.sellnum}</span>
                    袋
                </div>
                <!-- 第二块区域 -->
                <div class="gddt_box mt5 ml20">
                    <span class="c999">评价：</span>
                    <a href="">
                        <span class="ce54649">${data.evaluate}</span></a>&nbsp;&nbsp;&nbsp;&nbsp;
                    <a href=""><span class="c999">咨询：</span><span class="c999 ce54649">${data.consultation}</span></a>
                </div>
                <!-- 第三块区域 -->
                <div class="gddt_box mt5 ml20">
                    <span class="c999">赠送：</span>
                    最多
                    <span class="c78b300">${data.ecoins}</span>
                    E宠币
                </div>
            </div>
            <!-- 数据底部 -->
            <div class="gdd_bot">
                <ul class="clear">
                    <li class="fl">
                        <img src="./images/qualityassurance.png" alt="">
                        正品保证 <div class="qa-tc">
                            <div class="qa-tccon">
                                <em></em>
                                <span class="qa-sj"></span>
                                <p>正规授权，所有商品可100%追溯来源。</p>
                            </div>
                        </div>
                    </li>
                    <li class="fl">
                        <img src="./images/freeshipping.png" alt="">
                        99元包邮 <div class="qa-tc">
                            <div class="qa-tccon">
                                <em></em>
                                <span class="qa-sj"></span>
                                <p>单个仓库单笔订单满99包邮（西部大仓覆盖的川渝地区满58元包邮），E宠自营快递覆盖区域满58包邮；不包邮地区：西藏、新疆；不包邮快递：顺丰、EMS；
                                </p>
                            </div>
                        </div>
                    </li>
                    <li class="fl">
                        <img src="./images/thirtydays.png" alt="">
                        30天退货 <div class="qa-tc">
                            <div class="qa-tccon">
                                <em></em>
                                <span class="qa-sj"></span>
                                <p>在不影响该商品二次销售的情况下，自收到商品30天内，可申请退换货服务（定制狗牌、蛋糕等特殊商品除外）。</p>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 规格 -->
        <div class="gd_size mt15 clear">
            <span class="fl ft14 db c999">${data.pguige}</span>
            <div class="norms-con fl">
                `;
        data.sizes.forEach((el, index) => {
            strHtml += `
                  <a href="javascript:;" title="1.5kg" class="norms-a">${el}<span class="goods-select hide"></span>
                 </a>`
        });
        strHtml +=
            `
            </div>
        </div>

        `;
        $(".createBox").html(strHtml);
        $(".norms-con a").eq(0).addClass("guige")
        $(".norms-con a").eq(0).find("span").removeClass("hide")

        // 搭配购买
        $(".withbuy_imgs_img").attr("src", data.image[0]);
        var strHtml2 = `
        <b>
        <a href="">${data.pname}</a></b>
        <p class="c999">套餐价:<span class="ce3393c ft16">￥<i class="ft16">${data.pprice[0]}</i></span>
        </p>
        <p class="c999">E宠价:￥${data.pprice[0]}</p>
        `;
        $(".createTxt").html(strHtml2);

        // 放大镜小图标切换图片大小
        $(".gmbps_minImg li").each((index, el) => {
            $(el).on("click", function () {
                $(".minImg")[0].setAttribute("src", $(el).find("img")[0].getAttribute("src"));
                $(".bigImg")[0].setAttribute("src", $(el).find("img")[0].getAttribute("src"));
            })
        })
        // 
        // 
        // 切换对应价格
        $(".norms-a").each((index,el)=>{
            $(el).on("click",function(){
                $(".echong").text(data.pprice[index]);
            })
        })
    })








})